{% from "utils.html" import link %}

{% macro collapsible_li(starts_open, title_left, title_right) %}
<li x-data='{open: {{ "true" if starts_open else "false" }}}'>
  <button class='w-full' x-on:click='open=!open'>
    <div class='flex justify-between px-4 py-4 bg-slate-100 hover:bg-slate-200 hover:cursor-pointer'
      :class='open ? "bg-slate-200" : ""'>
      <div class='text-lg font-light'>{{ title_left }}</div>
      <div class='text-lg font-light'>{{ title_right }}</div>
    </div>
  </button>
  <div class='relative overflow-hidden transition-all' {{ "" if starts_open else "x-cloak" }}
    :class='open ? "h-full" : "h-0"'>
    {{ caller() }}
  </div>
</li>
{% endmacro %}

{% macro resource_cost_table(cost_breakdown) %}
<table class='w-full'>
  <tbody class='divide-y'>
    {% for resource_cost in cost_breakdown %}
    <tr>
      <td class='p-2'>{{ resource_cost['resource'] }}</td>
      <td class='p-2 text-right'>{{ resource_cost['cost'] }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>
{% endmacro %}

{% macro kv_table(items) %}
<table class='w-full'>
  <tbody class='divide-y'>
    {% for k, v in items.items() %}
    <tr>
      <td class='p-2'>{{ k }}</td>
      <td class='p-2 text-right'>{{ v }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>
{% endmacro %}

{% macro status_display_row(status_name, count, state_value, base_path, batch_id) %}
<tr>
  <td class='p-2'>{{ status_name }}</td>
  <td class='p-2 text-right'>
    <div class='inline-flex items-center gap-1'>
      {{ count }}
      {% if count > 0 %}
      <a class='hover:text-sky-600' href="{{ base_path ~ '/batches/' ~ batch_id ~ '?q=state+%3D+' ~ state_value }}" title="Filter to {{ status_name.lower() }} jobs">
        <span class="material-symbols-outlined text-sm">filter_alt</span>
      </a>
      <a class='hover:text-sky-600' href="{{ base_path ~ '/batches/' ~ batch_id ~ '?q=state+%21%3D+' ~ state_value }}" title="Filter to non-{{ status_name.lower() }} jobs">
        <span class="material-symbols-outlined text-sm">filter_alt_off</span>
      </a>
      {% endif %}
    </div>
  </td>
</tr>
{% endmacro %}

{% macro incomplete_status_row(count, base_path, batch_id) %}
<tr>
  <td class='p-2'>Incomplete (Blocked, Queued or Running)</td>
  <td class='p-2 text-right'>
    <div class='inline-flex items-center gap-1'>
      {{ count }}
      {% if count > 0 %}
      <a class='hover:text-sky-600' href="{{ base_path ~ '/batches/' ~ batch_id ~ '?q=state+%21%3D+success%0D%0Astate+%21%3D+failed%0D%0Astate+%21%3D+cancelled' }}" title="Filter to incomplete jobs">
        <span class="material-symbols-outlined text-sm">filter_alt</span>
      </a>
      <a class='hover:text-sky-600' href="{{ base_path ~ '/batches/' ~ batch_id ~ '?q=state+%21%3D+pending%0D%0Astate+%21%3D+ready%0D%0Astate+%21%3D+creating%0D%0Astate+%21%3D+running' }}" title="Filter to non-incomplete jobs">
        <span class="material-symbols-outlined text-sm">filter_alt_off</span>
      </a>
      {% endif %}
    </div>
  </td>
</tr>
{% endmacro %}

{% macro job_status_table(batch, base_path) %}
<table class='w-full'>
  <tbody class='divide-y'>
    {{ incomplete_status_row(batch['n_jobs'] - batch['n_completed'] - (batch['n_running'] or 0), base_path, batch['id']) }}
    {{ status_display_row('Succeeded', batch['n_succeeded'], 'success', base_path, batch['id']) }}
    {{ status_display_row('Failure or error', batch['n_failed'], 'bad', base_path, batch['id']) }}
    {{ status_display_row('Cancelled', batch['n_cancelled'], 'cancelled', base_path, batch['id']) }}
  </tbody>
</table>
{% endmacro %}
